<template>
    <div class="toast tanxin">
        <i :class="['iconfont', $store.state.toast.icon]"></i>
        <section class="content">{{$store.state.toast.content}}</section>
    </div>
</template>

<script>
export default {
    data () {
        return {}
    },
}
</script>
 
<style lang = "less" scoped>
@import "../assets/base.less";
.toast {
    position: fixed;
    background-color: #fff;
    padding: 10px 20px;
    align-items: center;
    left: 50%;
    transform: translateX(-50%);
    top: 20px;
    border-radius: 5px;
    box-shadow: 0 0 10px pink;
    .content {
        margin-left: 10px;
    }
}
</style>